<template>
	<div id="container">
		<!-- header -->
		<header>
			<van-nav-bar
			  class="reg-title"
			  title="新会员注册"
			  left-text="返回"
			  left-arrow
			  @click-left="onClickLeft()"
			/>
		</header>
	    <div id="content">
			<!-- 输入框 -->
			<input type="text" v-model="username" class="reg-ipt" placeholder="请输入用户名">
			<input type="password" v-model="password" class="reg-ipt" placeholder="请输入密码">
			<!-- 注册按钮 -->
			<van-button type="danger" class="reg-login" @click="reg()">注册</van-button>
		</div>
		<footer>
			<a href="tel:4008898000">遇到问题？东东帮您></a>
		</footer>
	</div>
</template>

<script>
	
	import * as api from '../../api/postregister'
	import {Dialog} from 'vant'
	export default{
		name:'Register',
		data(){
			return{
				username:'',
				password:''
			}
		},
		methods:{
			onClickLeft() {
			  this.$toast('返回')
			  this.$router.go(-1)
			},
			reg(){			
				let p = /^[\w]{5,14}$/
				if(p.test(this.password)){
					api.postRegister({username:this.username,password:this.password}).then((data)=>{			
						if(data.data.code==200){
							Dialog({message:data.data.msg}).then(()=>{
								this.$router.push('/login')
							})
						}else{
							Dialog({message:data.data.msg}).then(()=>{
								this.$router.push('/login')
							})
						}
					})
				}
			}
		},
		mounted(){
			
		}
	}
</script>

<style scoped>
/* ---------------------------header--------------- */
header .van-icon-arrow-left:before{
	color: #000000;
	font-size: 18px;
	font-weight: 600;
}
header .van-nav-bar__text,.van-nav-bar__title{
	font-family: "楷体";
	font-size: 20px;
	font-weight: 600;
	color: #000000;
	line-height: 54px;
}
header .van-nav-bar{
	height: 54px;
	border-bottom: 1px solid #d6d3d3;
}
/* --------------------输入框content--------------- */
	#content{
		text-align: center;
		margin-top: 54px;
	}
	#content .van-field{
		height: 65px;
		font-size: 20px;
		border: 1px solid #000000;
	}
	.reg-ipt{
		border: 0;
		color: #000;
		font-size: 22px;
		font-family: "楷体";
		width: 342px;
		border-bottom: 1px solid #eeeeee;
		margin-bottom: 38px;
	}
	/* 按钮 */
	.reg-login {
		width: 342px;
		height:47px;
		opacity: 0.6;
		font-family: "楷体";
		font-size: 22px;
		line-height:47px;
	}
	/* footer帮助电话 */
	
	footer a{
		position: absolute;
		bottom:25px;
		left:123px;
		color: #5d5d5d;
		font-size: 15px;
		font-family: "楷体";
	}
</style>
